<template>
    <div>
        <div class="title1">绑定烟草证验证码</div>
        <div class="content">
            <el-input
            v-model="verificationCode"
            placeholder="请输入绑定或解绑烟草证验证码"
            size="small"
            />
            <el-button
            type="primary"
            size="mini"
            class="save"
            @click="handleEdit"
            >保存</el-button>
        </div>
        <div class="title1">手机验证码</div>
        <div class="content">
            <el-input
            v-model="loginCode"
            placeholder="请输入绑定手机号证验证码"
            size="small"
            />
            <el-button
            type="primary"
            size="mini"
            class="save"
            @click="handlePhoneEdit"
            >保存</el-button>
        </div>
        <div class="title1">解绑烟草证验证码</div>
        <div class="content">
            <el-input
            v-model="verificationCode1"
            placeholder="请输入解绑验证码"
            size="small"
            />
            <el-button
            type="primary"
            size="mini"
            class="save"
            @click="handleDelCodeEdit"
            >保存</el-button>
        </div>
    </div>
</template>
<script>
import {getCode,editCode,getPhoneCode,editPhoneCode,getDelCode,editDelCode} from '@/api/bindingCode/bindingCode'
export default{
    data(){
        return{
            verificationCode:'',
            verificationCode1:'',
            loginCode:''
        }
    },
    mounted(){
        this.showCode()
        this.showPhoneCode()
        this.showDelCode()
    },
    methods:{
        showDelCode(){
            getDelCode()
            .then((res) => {
                console.log(res,'验证码')
                this.verificationCode1 = res.data.dictValue
            })
        },
        showCode(){
            getCode()
            .then((res) => {
                console.log(res,'验证码')
                this.verificationCode = res.data.dictValue
            })
        },
        handleEdit(){
            if(this.verificationCode==""){
                this.$message.error('验证码不能为空');
                return
            }
            editCode({verificationCode:this.verificationCode})
            .then(res=>{
                this.$message.success('保存成功');
            })
        },
        showPhoneCode(){
            getPhoneCode()
            .then((res) => {
                console.log(res,'验证码')
                this.loginCode = res.data.dictValue
            })
        },
        handlePhoneEdit(){
            if(this.verificationCode==""){
                this.$message.error('验证码不能为空');
                return
            }
            editPhoneCode({loginCode:this.loginCode})
            .then(res=>{
                this.$message.success('保存成功');
            })
        },
        handleDelCodeEdit(){
            if(this.verificationCode1==""){
                this.$message.error('验证码不能为空');
                return
            }
            editDelCode({loginCode:this.verificationCode1})
            .then(res=>{
                this.$message.success('保存成功');
            })
        },
    }
}
</script>
<style scoped>
.content{
    display: flex;
    width: 400px;
    padding:  10px 20px;
}
.save{

    margin-left: 10px;
}
.title1{
    text-align: left;
    padding: 0 20px;
}
</style>
